<template>
    <div class="section-header text-center">
        <h6>合作的企业超过  100+</h6>
    </div>
    <div class="partner__wrapper">
        <SwiperSlide :dataList="partnerTwo" :breakpoints="breakpoints" :loop="true" :autoplay="autoplay" :speed="speed"
            :pagination="pagination" :grabCursor="grabCursor">
            <template #content="{ item }">
                <div class="partner__item">
                    <div class="partner__item-inner">
                        <img :src="item.img" alt="partner logo">
                    </div>
                </div>
            </template>
        </SwiperSlide>
    </div>
</template>

<script>
import SwiperSlide from "@/components/base/slots/SwiperSlide.vue";
export default {
    components: { SwiperSlide },
    props: {
        partnerTwo: {
            type: Array,
            default: () => [],
        },
    },
    data() {
        return {
            spaceBetween: 10,
            grabCursor: true,
            loop: true,
            slidesPerView: 2,
            breakpoints: {
                320: {
                    slidesPerView: 2,
                },
                768: {
                    slidesPerView: 3,
                },
                992: {
                    slidesPerView: 4,
                    spaceBetween: 15,
                },
                1200: {
                    slidesPerView: 5,
                    spaceBetween: 25,
                },
            },
            autoplay: {
                delay: 1,
                disableOnInteraction: true,
            },
            speed: 3000,
            pagination: {
                el: ".slider__pagination-1",
                clickable: true
            },
        }
    },

}
</script>

<style></style>